import { InboxOutlined, UploadOutlined } from '@ant-design/icons';
import {
    Button,
    Checkbox,
    Col,
    Form,
    InputNumber,
    Radio,
    Rate,
    Row,
    Select,
    Slider,
    Switch,
    Upload,
    Input,
    DatePicker,
    TimePicker
} from 'antd';
import http from '../../../../utils/fetchHttp';
import "./index.scss"


const { Option } = Select;
const { RangePicker } = DatePicker;
let father;

const formItemLayout = {
    labelCol: {
        span: 6,
    },
    wrapperCol: {
        span: 14,
    },
};
const normFile = (e) => {
    console.log('Upload event:', e);
    if (Array.isArray(e)) {
        return e;
    }
    return e?.fileList;
};
//提交成功
const onFinish = (fieldsValue) => {
    const { getCount } = father;
    const datePicker = fieldsValue['date-picker'];
    const values = {
        ...fieldsValue,
        'date-picker': datePicker.$d,
    };
    let myType;
    console.log(values.deductionType.length === 1);
    if (values.deductionType.length === 1) {
        values.deductionType.push(" ");
        myType = values.deductionType.toString();
        myType = myType.slice(0, -2)
    } else {
        myType = values.deductionType.join(",");
    }
    // 中国标准时间 转换成 年月日
    const formatDateTime = (date) => {
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        m = m < 10 ? ('0' + m) : m;
        var d = date.getDate();
        d = d < 10 ? ('0' + d) : d;
        var h = date.getHours();
        var minute = date.getMinutes();
        minute = minute < 10 ? ('0' + minute) : minute;
        var second = date.getSeconds();
        second = second < 10 ? ('0' + second) : second;
        return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
    }
    const myAddTime = formatDateTime(datePicker.$d)

    const addObj = {
        deductionTitle: values.deductionTitle,
        deductionStandard: values.deductionStandard,
        deductionType: myType,
        addTime: myAddTime,
        productGrounding: values.productGrounding = true ? 1 : 0
    }
    console.log(addObj);
    // 添加请求
    http({
        url: '/deduction/addData',
        method: 'post',
        data: addObj
    }).then(res => {
        if (res.code === 200) {
            console.log(res);
        } else {
            console.log(res);
        }
    })


    const myValue = 0
    getCount(myValue);
};

const AddDeduction = (props) => {
    father = props
    const { getCount } = props;
    const goBack = () => {
        const value = 0
        getCount(value);
    };

    const config = {
        rules: [
            {
                type: 'object',
                required: true,
                message: '请选择时间!',
            },
        ],
    };
    return (
        <div className='addDeduction'>
            <Form
                name="validate_other"
                {...formItemLayout}
                onFinish={onFinish}
                initialValues={{
                    productGrounding: true
                }}
                style={{
                    maxWidth: 600,
                }}
            >
                <Form.Item
                    label="抵扣标题"
                    name="deductionTitle"
                    rules={[
                        {
                            required: true,
                            message: '请输入抵扣标题!',
                        },
                    ]}
                >
                    <Input placeholder='请输入抵扣标题' />
                </Form.Item>
                <Form.Item
                    label="抵扣标准"
                    name="deductionStandard"
                    rules={[
                        {
                            required: true,
                            message: '请设置抵扣标准!',
                        },
                    ]}
                >
                    <Input addonBefore="每公里" placeholder='请设置抵扣金额' />
                </Form.Item>
                <Form.Item name="deductionType" label="适用行程类型">
                    <Checkbox.Group>
                        <Row>
                            <Col span={8}>
                                <Checkbox
                                    value="徒步"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    徒步
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="登山"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    登山
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="骑行"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    骑行
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="自驾"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    自驾
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="跑步"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    跑步
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="越野跑"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    越野跑
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="旅行"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    旅行
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="滑雪"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    滑雪
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="其他"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    其他
                                </Checkbox>
                            </Col>
                        </Row>
                    </Checkbox.Group>
                </Form.Item>
                <Form.Item name="date-picker" label="添加时间" {...config}>
                    <DatePicker placeholder='请选择时间' />
                </Form.Item>
                <Form.Item name="productGrounding" label="上架" valuePropName="checked">
                    <Switch />
                </Form.Item>
                <Form.Item
                    wrapperCol={{
                        xs: {
                            span: 24,
                            offset: 0,
                        },
                        sm: {
                            span: 16,
                            offset: 8,
                        },
                    }}
                >
                    <Button
                        type="primary"
                        htmlType="submit"
                        className='addBtn'
                    >
                        提交
                    </Button>
                    <Button
                        className='goBackBtn'
                        type="primary"
                        htmlType="submit"
                        onClick={goBack}
                    >
                        返回
                    </Button>
                </Form.Item>
            </Form>
        </div>
    );
}

export default AddDeduction;